<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="./vue.js"></script>
</head>
<body>
<div id="app">
    <p style="font-size: 25px;">计数器：{{counter}}</p>
    <button @click="counter++" style="font-size:25px">Click Me!!</button>
</div>
<script>
    var vm = new Vue({
        el:app,
        data:{
            counter:1
        },
    });
    vm.$watch('counter',function (nval,oval) {
        alert(`计数器值变化：${oval} 变为 ${nval}!`)
    });
    setTimeout( () => {
        vm.counter += 20
    },5000)
</script>
</body>
</html>